<template>
	<view class="me-page">
		<view class="myInfo">
			<image src="@/static/mebg.jpg" mode="" style="width: 100%; height: 100%"></image>
			<view class="myInfo-contain">
				<custom-bar custonName="我的" headColorChild="rgba(255,255,255,0)" :isShowBack="false">
				</custom-bar>
				<view class="myInfo-detail">
					<view class="myInfo-detail-left">
						<view class="myInfo-detail-left-avatar">

							<up-avatar :src="avatarUrl" size="120rpx"></up-avatar>

						</view>
						<view class="myInfo-detail-left-user">
							<view class="myInfo-detail-left-user-name">
								{{ userName || userStore.getUserInfo().nickname }}
							</view>
							<view class="myInfo-detail-left-user-phone">
								<!-- 13000000000 -->
							</view>
						</view>
					</view>
					<view class="myInfo-detail-right">
						<!-- <uni-icons type="right" size="30" color="#fff"></uni-icons> -->
					</view>
				</view>
			</view>
		</view>
		<view class="me-cell-contain">
			<up-cell-group>
				<!-- <up-cell title="我的报修" :isLink="true" size="large" @click="handlerCell('req')">
					<template #icon>
						<image src="@/static/icons/requestForm.png" mode="aspectFit"
							style="width: 28rpx; height: 28rpx;padding:0 10rpx">
						</image>
					</template>
				</up-cell> -->
				<up-cell title="个人信息" :isLink="true" size="large" @click="handlerCell('meInfo')">
					<template #icon>
						<image src="@/static/icons/u18.png" mode="aspectFit"
							style="width: 36rpx; height: 36rpx; padding: 0 10rpx">
						</image>
					</template>
				</up-cell>
				<up-cell title="切换权限" :isLink="true" size="large" @click="handlerCell('changeUser')"
					v-if="userStore.getUserInfo().isAdmin">
					<template #icon>
						<image src="@/static/icons/changeUser.png" mode="aspectFit"
							style="width: 36rpx; height: 36rpx; padding: 0 10rpx">
						</image>
					</template>
				</up-cell>
			</up-cell-group>
		</view>
		<view class="login-btn">
			<up-button type="primary" text="立即登录" v-if="!openid" @click="goLogin"></up-button>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from "vue";
	import {
		onShow
	} from "@dcloudio/uni-app";
	import {
		useUserStore
	} from "@/store/user";

	const userStore = useUserStore();
	const userName = ref("");
	const avatarUrl = ref('')
	const openid = ref('')
	// 每次页面显示时判断登录状态
	onShow(() => {
		avatarUrl.value = userStore.getUserInfo().avatar;
		openid.value = uni.getStorageSync("openid");
		if (openid.value) {
			// 查看是否有项目管理员权限
			uni.$u.http
				.post("/wechat/getIsItemOperator", {
					openid: openid.value,
				})
				.then((res) => {
					if (res.success) {
						userStore.updAdminType(res.isItemOperator);
					}
				});
		}
	});

	const handlerCell = (val) => {
		if (!openid.value) {
			// 未登录：提示并返回上一页
			uni.showModal({
				content: "此功能需要登录后方可查看详情,是否登录?",
				success: function(res) {
					if (res.confirm) {
						uni.navigateTo({
							url: "/pages/login/login",
						});
					}
				},
			});
			return
		}
		if (val == "req") {
			uni.navigateTo({
				url: "/Me/ReportFault/ReportFault",
			});
		}
		if (val == "changeUser") {
			uni.navigateTo({
				url: "/Me/changeIdentity/changeIdentity",
			});
		}
		if (val == "meInfo") {
			uni.navigateTo({
				url: "/Me/meInfo/meInfo",
			});
		}
	};

	const goLogin = () => {
		uni.navigateTo({
			url: "/pages/login/login",
		});
	}
</script>

<style lang="scss" scoped>
	@import "./me.scss";

	.login-btn {
		width: 60vw;
		position: absolute;
		left: 20vw;
		bottom: 100rpx;

	}
</style>